<template>
    <VoSchemaLayoutForm ref="sf" v-if="previewSchema" :model="previewModel" :schema="previewSchema" :rules="previewRules" @change="formChange" @submit="submit"></VoSchemaLayoutForm>
</template>

<script>
import api from '@/http'
import { clone } from '@/utils/clone'
export default {
    props: {
        schema: Object,
        rules: Object
    },
    data() {
        return {
            previewModel: {},
            previewSchema: null,
            previewRules: null
        }
    },
    created() {
        console.log('created');
    },
    methods: {
        handleSchema(properties, models = {}) {
            for (const key in properties) {
                const { model, source } = properties[key];
                if (model) {
                    models[model] = null;
                    if (Array.isArray(properties[key].rules)) {
                        this.previewRules[model] = properties[key].rules.filter(e => e._checked).map(e => {
                            return {
                                type: e.type,
                                required: e.required,
                                message: e.message,
                                trigger: e.trigger,
                                pattern: e.pattern
                            }
                        })
                        delete properties[key].rules
                    }
                    if (source && source.use && source.http) {
                        properties[key].enum = []
                        properties[key].asyncData = (resolve) => {
                            const { method, url, params } = source.http
                            api.ajax(method, url, this.handleParams(params)).then(res => {
                                if (res.code === 0) {
                                    resolve(res.data || [])
                                }
                            }).catch(() => {
                                resolve([])
                            })
                        }
                    }
                }
                if (properties[key].properties) {
                    this.handleSchema(properties[key].properties, models)
                }
            }
            return models
        },
        load() {
            const schema = clone(this.schema);
            this.previewRules = {};
            this.previewModel = this.handleSchema(schema.properties);
            this.previewSchema = schema;
            this.$nextTick(() => {
                // this.$refs.sf.clearValidate()
                this.$refs.sf.resetFields()
            })
        },
        handleParams(params) {
            const p = {}
            if (Array.isArray(params)) {
                params.forEach(e => {
                    if (e.key && e.value) {
                        p[e.key] = e.value
                    }
                })
            }
            return p
        },
        formChange(e) {
            console.log(e);
        },
        submit() {
            console.log(this.previewModel);
        }
    }
}
</script>

<style>

</style>
